<template>

  <div class="praise-mov" @click="gotoXq(item.movieId)">
    <div class="top">
      <!-- 图片 -->
      <img :src="`${item.poster}`" alt="" />
      <span class="center2">
        观众评分&nbsp;&nbsp;
        <!-- 评分 -->
        <span class="c-center1">{{ item.score }} </span>
      </span>
    </div>
    <h5 class="name line-ellipsis">{{ item.name }}</h5>
  </div>
</template>

<script>
export default {
  props: {
    item: Object,
  },
    methods:{
        gotoXq(id) {
          console.log(id);
            this.$router.push("/info/"+id);
        }
    }
};
</script>

<style lang="less">
.praise-mov {
  display: inline-block;
  width: 85px;
  overflow: hidden;
  margin-right: 10px;
 

  .top {
    display: inline-block;
    position: relative;
    img {
      width: 85px;
      height: 115px;
    }
    .center2 {
      position: absolute;
      left: 4px;
      bottom: 2px;
      color: #faaf00;
      font-size: 11px;
      font-weight: 600;
    }
  }
  .name {
    font-size: 13px;
    color: #222;
    margin: 0 0 3px;
  }
  .line-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
}
</style>